﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Admin.Master" Inherits="System.Web.Mvc.ViewPage<OptimumInfra.ViewData.ViewDataSupportServices>" %>

<asp:Content ID="EditContent" ContentPlaceHolderID="AdminContent" runat="server">
    <% if(TempData["info"] !=null) { %>
    <p style="text-align: center; color: Red;"><%=TempData["info"] %></p>
    <% } %>   
<ul class="tabs">
    <li><a href="#tab1">General Info</a></li>
    <li><a href="#tab2">Attribute</a></li>
</ul>

<div class="tab_container">
    <div id="tab1" class="tab_content">
        <!--Content-->
        <h2>Create new service support</h2>
    <p>

    <% using (Html.BeginForm()) { %>
        <%: Html.ValidationSummary(true, "Account creation was unsuccessful. Please correct the errors and try again.") %>
                <legend>Service Information</legend>
                <br />
          <table width="700px" style="margin-top: 10px;">
          <tr>
          <td>          
                <div class="editor-label">
                    <%: Html.LabelFor(resource => resource.Name) %>
                </div>
            </td> 
            <td>
                <div class="editor-field">
                    <%: Html.TextBoxFor(resource => resource.Name)%>
                    <%: Html.ValidationMessageFor(resource => resource.Name)%>
                </div>
           </td> 
          </tr>
          <tr>
               <td>
                <div class="editor-label">
                    <%: Html.LabelFor(m => m.Unit) %>
                </div>
                </td> 
                <td>
                <div class="editor-field">
                   <%: Html.TextBoxFor(resource => resource.Unit)%>
                    <%: Html.ValidationMessageFor(resource => resource.Unit)%>
                </div>
                </td>
  
            </tr>    
         <tr>       
            <td>
                <div class="editor-label">
                    <%: Html.LabelFor(m => m.Description) %>
                </div>
            </td>
            <td>
                 <div class="editor-field">
                    <%: Html.TextAreaFor(m => m.Description, 4, 10, new {style = "width: 95%; height:200px;", @class = "textarea" })%>
                    <%: Html.ValidationMessageFor(m => m.Description)%>
                </div>
            </td>
          </tr>
           <tr>       
            <td colspan="2">
                 <p>
                    <input type="submit" value="Update" />
                </p>
            </td>
          </tr>    
               
            </table>
            <%:Html.HiddenFor(m=>m.Id) %>
    <% } %>
    </div>
    <div id="tab2" class="tab_content">
       <!--Content-->

    <% using (Html.BeginForm("SavePrice", "ServiceSupport", new { Id = Model.Id }, FormMethod.Post, new { id = "form-user", name = "form-user" }))
       {%>
       
                 <legend>Attribute Information</legend>
         <br />
        <br />
          <table>
          <tr>
            <th>--</th>
            <th>Amount</th>
            <th>Price</th>
             <th>Configure</th>
          </tr>
          <%
        foreach (KeyValuePair<int, int> a in Model.Prices as Dictionary<int, int>)
        {           
            %>
          <tr>
          <td><%:Html.LabelFor(resource => resource.Id)%></td>
          <td>          
               <div class="editor-field">
                <input type="text" name="amount" value="<%=a.Key %>" />
               </div>
            </td> 
            <td>
                <div class="editor-field">
                <input type="text" name="price" value="<%=a.Value %>" />
               </div>
           </td> 
           <td>
                <a onclick="return confirm('Delete attribute?');" href="/ServiceSupport/DeleteAttribute/<%=Model.Id %>?amount=<%=a.Key %>">Delete</a>            

           </td>
          </tr>    
               
           
            <%:Html.HiddenFor(m => m.Id)%>
    <% 
        }
           %>  
           </table>
            <br />
            <div id="">
             <div style=" width: 100%; height: 30px;">
            <span>Create new resource attribute</span>
            </div>
            <span>Amount:</span>
            <input type="text" name="new_amount" id="new_amount" size="5" />
             <span>Price:</span>
            <input type="text" name="new_price" id="new_price" size="5" />
         </div>
           <p>
                 <input type="submit" value="Create" />
             </p> 
        <%
        }
           %>
    </div>
      <div id="result-user"></div>

</div>
<script type="text/javascript">
    $(document).ready(function () {

        //When page loads...
        $(".tab_content").hide(); //Hide all content
        $("ul.tabs li:first").addClass("active").show(); //Activate first tab
        $(".tab_content:first").show(); //Show first tab content

        //On Click Event
        $("ul.tabs li").click(function () {

            $("ul.tabs li").removeClass("active"); //Remove any "active" class
            $(this).addClass("active"); //Add "active" class to selected tab
            $(".tab_content").hide(); //Hide all tab content

            var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content
            $(activeTab).fadeIn(); //Fade in the active ID content
            return false;
        });

    });
</script>
<script type="text/javascript">

    $(document).ready(function () {
        var options = {
            beforeSubmit: showRequest, // call this function before sending data to the server
            success: showResponse, // call this function once we have a response form the server
            type: 'post',
            dataType: 'json', // important! expecting data type is JSON
            resetForm: true
        };

        $('#form-user').ajaxForm(options);
    });

    function showRequest(formData, jqForm, options) {
        $("#result-user").empty().html('Loading….'); // display loading
        $("#form-user :input").attr("disabled", true); // disable inputs
    }

    function showResponse(data, statusText, xhr, $form) {
        $("#result-user").empty();
        $("#form-user :input").attr("disabled", false);
        // here ‘data’ is an object. See below how it is used:
        $("#welcome").html("Hello, ");
        $("#number").html("Number of posts: ");
        $("#lastpost").html(data.LastPost);
    }
</script>
</asp:Content>
